<template>
  <view>
    <z-paging ref="paging" style="padding-bottom: 60px" v-model="dataList" :safe-area-inset-bottom="true" :auto-show-back-to-top="true" :use-page-scroll="false" @query="queryList">
      <view slot="top">
        <scroll-view scroll-x class="bg-white nav text-center">
          <view class="flex text-center">
            <view
              class="cu-item flex-sub"
              :class="item.type == TabCura ? 'text-purple cur' : ''"
              v-for="(item, index) in tabList"
              :key="index"
              @tap="tabSelect"
              :data-id="item.type"
            >
              {{ item.title }}
            </view>
          </view>
        </scroll-view>
      </view>
      <view class="item margin-bottom-sm bg-white" v-for="(item, index) in dataList" :key="index">
        <view class="cu-bar bg-white solid-bottom col-2">
          <view class="action">单号：{{ item.order }}</view>
          <view class="action">
            <text class="text-green" v-if="item.state == 2">处理成功</text>
            <text class="text-gray" v-else-if="item.state < 2">处理中</text>
            <text class="text-pink" v-else-if="item.state == 3">失败退回</text>
          </view>
        </view>
        <view class="grid col-1 padding-sm text-gray text-sm">
          <view class="flex">
            <view class="flex-sub text-left margin-xs">
              申请金额:
              <text class="text-orange margin-left-sm text-price">{{ item.money }}</text>
            </view>
            <view class="flex-sub margin-xs text-right">
              实际到账:
              <text class="text-price text-bold text-green text-df margin-left-sm">{{ (parseFloat(item.money) - parseFloat(item.price)).toFixed(2) }}</text>
            </view>
          </view>
          <view class="text-left margin-xs">
            提现账号:
            <text class="text-black margin-left-sm">{{ item.preone.accounts }}</text>
          </view>
          <view class="text-left margin-xs">
            申请时间:
            <text class="text-black margin-left-sm">{{ item.create_time }}</text>
          </view>
          <view class="text-left margin-xs" v-if="item.state > 1">
            处理时间:
            <text class="text-black margin-left-sm">{{ item.update_time }}</text>
          </view>
          <view class="text-left margin-xs" v-else>
            处理时间:
            <text class="text-black margin-left-sm">--</text>
          </view>
        </view>
      </view>
      <v-footer :bgColor="bgC" tab="my" class="buttonmenu" slot="bottom"></v-footer>
    </z-paging>
    <v-popup @update:isShow="isShow = $event" :isShow="isShow"></v-popup>
    <!-- #ifdef MP-WEIXIN -->
    <v-kefu @tap="tokefu()"></v-kefu>
    <!-- #endif -->
    <!-- #ifndef MP-WEIXIN -->
    <view @click="tokefu()" class="">
      <v-kefu></v-kefu>
    </view>
    <!-- #endif -->
  </view>
</template>

<script>
import footer from '@/components/footer.vue';
import kefu from '@/components/kefu.vue';
import popup from '@/components/popup.vue';
export default {
  components: { 'v-footer': footer, 'v-popup': popup, 'v-kefu': kefu },
  data() {
    return {
      tabList: [
        { title: '全部订单', type: 0 },
        { title: '已完成', type: 1 },
        { title: '处理中', type: 2 },
        { title: '失败订单', type: 3 }
      ],
      dataList: [],
      TabCura: 0,
      isShow: 0, //控制客服弹出层
      bgC: false
    };
  },
  onLoad() {},
  onShow() {
    var that = this;
    this.bgC = that.app.background;
  },
  methods: {
    tokefu() {
      this.isShow = !this.isShow;
    },
    queryList(pageNo, pageSize) {
      const params = {
        pageNo: pageNo,
        pageSize: pageSize,
        type: this.TabCura
      };
      var that = this;
      uni.request({
        method: 'post',
        url: that.app.apiHost + '/cashrecords',
        header: { Authorization: 'bearer ' + that.app.getAuthCode() },
        data: params,
        success: (data) => {
          if (data.data.code == -1) {
            that.app.showMsg('请登陆后再操作!', '../login/login');
          }
          let list = data.data.data.data;
          console.log(list);
          that.$refs.paging.complete(list);
        },
        fail(a) {
          that.$refs.paging.complete(false);
        }
      });
    },
    tabSelect(e) {
      this.TabCura = e.currentTarget.dataset.id;
      this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
      this.$refs.paging.reload();
    }
  }
};
</script>

<style>
page {
  background-color: #f1f1f1;
}
</style>
